@@include('../_includes/html-head.html', {"title": "Vvveb - Signup", "path":"../"})


<body class="signup">
	
	@@include('../_includes/header.html')

	<main id="site-content" role="main">


        <div class="container">
            <div class="row justify-content-center">
                <div class="col-12 col-md-8">
										  
					<div class="row">
					
						<div class="col-lg-8 mx-auto">
					
							<div class="card  card-default my-4">

								<div class="card-header bg-body p-5 pb-2">
									<h1 class="mb-1 h2 fw-bold">Sign up</h1>
									<p class="text-muted">Welcome! Enter your data to create an account.</p>

									@@include('../_includes/notifications.html', {type:"login"})

								</div>								


							  <div class="card-body p-5">
								
								
								<form action="" method="post" enctype="multipart/form-data" data-v-url="user/index/signup" id="signup-form">
									<input type="hidden" name="csrf" data-v-csrf>	
										
									<!--	
									<div class="mb-3 input-group">
										<span class="input-group-text"> <i class="la la-user"></i> </span>
										<input name="login" class="form-control border-start-0" placeholder="Username" type="text" required>
										
									</div> 
									-->
									
									
									<div class="mb-3 input-group">
										<span class="input-group-text"> <i class="la la-user"></i> </span>
										<input name="first_name" class="form-control border-start-0" placeholder="First Name" type="text" required>
									</div>

									<div class="mb-3 input-group">
										<span class="input-group-text"> <i class="la la-user"></i> </span>
										<input name="last_name" class="form-control border-start-0" placeholder="Last Name" type="text" required>
									</div>

									<div class="mb-3 input-group">
										<span class="input-group-text"> <i class="la la-envelope"></i> </span>
										<input name="email" class="form-control border-start-0" placeholder="Email address" type="email" required>
									</div>
									
									<div class="mb-3 input-group">
										<span class="input-group-text"> <i class="la la-lock"></i> </span>
										  <input type="password" minlength="6" autocorrect="off" class="form-control border-start-0" placeholder="Password"  id="password" name="password" autocomplete="new-password" value="" aria-label="Password" required>
										  <div class="input-group-append">
											<button class="btn px-3 border border-start-0" type="button" onclick="togglePasswordInput(this, 'password')"><i class="la la-eye-slash"></i></button>
										  </div>
									</div>
									
									<div class="mb-3 input-group">
										<span class="input-group-text"> <i class="la la-lock"></i> </span>
										  <input type="password" minlength="6" autocorrect="off" autocomplete="new-password" class="form-control border-start-0" placeholder="Repeat password"  id="confirm_password" name="confirm_password" value="" aria-label="Repeat Password" required>
										  <div class="input-group-append">
											<button class="btn px-3 border border-start-0" type="button" onclick="togglePasswordInput(this, 'confirm_password')"><i class="la la-eye-slash"></i></button>
										  </div>
									</div>          

									<div class="mb-3">
									  <div class="form-check mb-1">
										<input type="checkbox" class="form-check-input" id="terms" name="terms" required>
										<label class="form-check-label" for="terms">
										  </span>I agree to</span>
										  <a href="page/terms-conditions" target="_blank" data-v-url="content/page/index" data-v-url-params='{"slug":"terms-conditions"}'>Terms and conditions</a>
										</label>
									  </div>
									</div>
                            
									<div class="mb-3">
										<button type="submit" class="btn btn-primary w-100 btn-signup">Create Account</button>
									</div>      
									
									<div class="text-center">Have an account? <a href="" data-v-url="user/login/index" >Log In</a> </div>
								</form>
							
							
								</div>
							</div>
						</div>
					</div>

            </div>
        </div>
    </div>

</main>
@@include('../_includes/footer.html')

@@include('../_includes/footer-scripts.html')

</body>
</html>
